<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,height=device-height, user-scalable=no,initial-scale=1, minimum-scale=1, maximum-scale=1">
    <title>支付</title>
    <link rel="stylesheet" href="css/Pay.css"/>
    <script type="text/javascript" src="js/jquery-1.12.1.min.js"></script>
    <script type="text/javascript" src="js/zfxx.js"></script>
    <script type="text/javascript" src="js/zftc.js"></script>
    <script src="/js/plugins/jrender/jrender.min.js"></script>
    <script src="/js/common.js"></script>
    <script>
        $(function () {
            var user = JSON.parse(sessionStorage.getItem("user"));
            var params=getParams();
            $.get("/shop/"+user.id+"/"+params.articleId,function (data) {
                $(".body").renderValues(data);
                $("#address2").renderValues(data.userInfo);

                console.log(data);
                $("#btn1").click(function(){
                    $("#btn2").removeClass("btn1").addClass("btn2");
                    $("#btn1").removeClass("btn2").addClass("btn1");
                    $("#yunfei").show();
                    $("#zt").hide();
                    $("#address2").show();
                    $("#totalCount").html(data.totalCost);
                });

                $("#btn2").click(function(){
                    $("#btn1").removeClass("btn1").addClass("btn2");
                    $("#btn2").removeClass("btn2").addClass("btn1");
                    $("#yunfei").hide();
                    $("#address2").hide();
                    $("#zt").show();
                    $("#totalCount").html(data.totalCost);
                });
            })

            //选择积分支付
            $("#btn3").click(function(){
                $(".menu").slideDown();
                $(".theme-popover-mask").show();

                $('#integralPay').click(function () {
                   console.log("0");
                  var resultCost=$("#totalCount").html();
                     $.ajax({
                        url:"/shop/"+params.articleId+"/"+resultCost,
                        type:"put",
                        /*resultCost: $("#totalCount").html(),*/
                        success:function (data) {
                            if(data.success){
                                window.alert("支付成功");
                                window.location.href="/store/allGoods.html?id="+user.id;
                            }else{
                                window.alert(data.msg);
                            }
                        }
                    })
                });
            });


        })
    </script>
</head>
<body>
<div class="body">
    <div class="tour">
        <a href="javascript:history.go(-1);" class="tour1"><img src="img/back.png" alt="" style="height: 26px;width: 20px"></a>
        <p>订单确认</p>
    </div>
    <div class="header3">
        <a href="javascript:;" class="shsm"><button type="button" id="btn1"  class="btn1">送货上门</button></a>
        <a href="javascript:;" class="ddzq"><button type="button" id="btn2" class="btn2">到店自取</button></a>
    </div>
        <div class="address" id="address2">
            <a href="http://map.baidu.com/" class="daohang"><img src="img/timg.jpg" alt="" style="width: 40px;display: inline-block" /></a>
            <div class="caizhu">
                <p class="person" id="span1">收货人：<i render-html="userName"></i></p><br/>
                <p class="person" id="span5">电话：<i render-html="phone"></i></p><br/>
                <p class="diqiu" id="span2">收货地址：<i render-html="address"></i></p>
            </div>
           <!-- <a href="javascript:;" class="xdz">&gt;</a>-->
        </div>
        <div class="address2" id="zt">
            <a href="http://map.baidu.com/" class="daohang"><img src="img/timg.jpg" alt="" style="width: 40px;display: inline-block" /></a>
            <div class="caizhu">
                <p class="saddress" id="span6">店铺名称：<i render-html="article.supplierName"></i></p><br/>
                <p class="store" id="span3">店铺电话：<i render-html="article.supplierPhone"></i></p><br/>
                <p class="saddress" id="span4">店铺地址:<i render-html="article.supplierAddress"></i></p>
            </div>
            <a href="javascript:;" class="xdz">&gt;</a>
        </div>
    <div class="hbt" style="width: 100%;height: 1rem;background-color:lightgrey"></div>
    <div class="zfdd">
        <ul>
            <li class="li1"><a href="spxq.html"><img render-src="article.picUrl" alt="" style="width: 60px;height: 60px"/></a></li>
            <li class="li2"><span render-html="article.articleName"></span></li>
            <li class="li3"><span>×<i render-html="number"></i></span><br/><span style="color: red">￥<i render-html="article.price"></i></span></li>
        </ul>
    </div>
   <!-- <div class="zfdd">
        <ul>
            <li class="li1"><a href="spxq.html"><img src="img/u67.png" alt="" style="width: 60px;height: 60px"/></a></li>
            <li class="li2"><span>商品名称</span></li>
            <li class="li3"><span>×1</span><br/><span style="color: red">￥100.00</span></li>
        </ul>
        <div style="clear: both"></div>
    </div>-->
    <div class="yunfei" id="yunfei">
        <ul>
            <li class="yunli">运费</li>
            <li class="qianli">(免运费)</li>
        </ul>
    </div>
    <div class="zjfy">
        <div class="fy">
           <!-- <p><span style="color: #000000">合计：</span>￥208</p>-->
            <p><span style="color: #000000">合计：</span>￥<i id="totalCount" render-html="article.price"></i></p>
        </div>
    </div>

    <div class="menu" id="zfym">
        <ul>
            <!--<li><a href="javascript:;" class="aclass" id="integralPay">积分支付</a></li>-->
            <li id="integralPay"><a>积分支付:<i>(我的积分:<i render-html="user.integral"></i></i>)</a></li>
            <li><a href="allGoods.html">返回商城首页</a></li>
           <!-- <li><a href="javascript:;">银联卡支付</a></li>
            <li><a href="javascript:;">招行卡支付</a></li>-->
        </ul>
    </div>

</div>
<div class="footing">
    <ul>
        <li class="li7"><a href="javascript:;"><button type="button" id="btn3">去支付</button></a></li>
    </ul>
</div>
<!--<div class="theme-popover-mask"></div>-->
</body>
</html>